<!--suppress ALL -->
<template>
	<div class="page maintainTask-page" data-page="maintainTask" style="z-index: 2">
		<div class="link-page-nav">
			<a href="#" class="link" @click=$root.backToTab()>
				<i class="iconfont icon-zuo"></i>
			</a>
		</div>
		<div class="link-page-top">
			<span class="link-page-dan" id="isDan_{{getNewId}}">单</span>
			<div class="link-page-title">保养作业</div>
			<a style="text-align: center; top: 0" @click="createDangers()">
				<i class="iconfont icon-APPicon_tianjia" style="font-size: 9px; color: #222222;"></i>
				<p style="font-size: 9px; color: #222222;">创建隐患<p>
			</a>
		</div>
		<div class="page-content" style="padding-bottom: 100px">
			<div class="waitWorkBor" @click="maintainEqu">
				<span id="waitWorkNum_{{getNewId}}">0</span>
				<p>待保养设备</p>
			</div>
			<div class="mine-margin">
				<span class="tt">作业区域</span>
				<div class="workArea">
					<span id="workArea_{{getNewId}}"></span>
				</div>
			</div>
			<div class="over-line"></div>
			<div class="mine-margin">
				<span class="tt">作业对象</span>
				<div class="workObj">
					<span style="float: left; color: #999999">消防系统</span> <span style="float: right; color: #333333"
						id="systemName_{{getNewId}}"></span>
				</div>
				<div class="workObj">
					<span style="float: left; color: #999999">资产类别</span> <span style="float: right; color: #333333"
						id="assetsType_{{getNewId}}"></span>
				</div>
				<div class="workObj" id="assetsNameView_{{getNewId}}">
					<span style="float: left; color: #999999">资产名称</span> <span style="float: right; color: #2471CA"
						id="assetsName_{{getNewId}}"></span>
				</div>
				<div class="workObj" id="finishNumView_{{getNewId}}">
					<span style="float: left; color: #999999">已完成数量</span> <span style="float: right; color: #2471CA"
						id="finishNum_{{getNewId}}"></span>
				</div>
			</div>
			<div class="over-line"></div>
			<div class="mine-margin">
				<span class="tt">作业标准</span>
				<p class="workContent" id="workStandard_{{getNewId}}"></p>
			</div>
			<div class="over-line"></div>
			<div class="mine-margin">
				<span class="tt">作业前拍照</span>
				<div style="margin-top: 20px;" id="picBeforeUrl_{{getNewId}}"></div>
			</div>
			<div class="mine-margin" style="margin-top: 50px">
				<span class="tt">作业后拍照</span>
				<div style="margin-top: 20px;" id="picAfterUrl_{{getNewId}}"></div>
			</div>
			<div class="mine-margin" style="margin-top: 50px">
				<span class="tt">作业填报</span>
				<div id="workContentList_{{getNewId}}"></div>
			</div>
			<div class="submitBtn" @click="upInfoData()">提交</div>
		</div>
	</div>
</template>

<script>
	return {
		mounted() {
			var self = this;
			var app = self.$app;
			//页面传参
			self.taskId = this.$route.params.taskId;
			self.businessId = this.$route.params.businessId;
			self.businessType = this.$route.params.businessType;
		},
		data: function () {
			return {
				getNewId: (new Date()).getTime(),
				//index : 0,//上传图片下标
				index: "", //保存点击上传图片上下文
				// taskId:'',
				//businessId:1765,
				//businessType:2,
				workContentList: null,
				fbsId:null,
				orgId:null,
			}
		},
		methods: {
			//创建隐患
			createDangers: function () {
				if(native.getDataByKey("IS_OFFLINE_MODULE") == 1){
					app.methods.showToastCenter("离线模式下不能跳转");
					return
				}else{
					app.router.navigate("/createTrouble/-1/"+this.$route.params.taskId+"/-1/");
				}
			},
			maintainEqu: function () {
				var self = this;
				if (self.businessType != 1)
					app.router.navigate("/maintainEquipt/" + this.$route.params.taskId + "/");
			},
			getInfoData: function () { //获取作业信息
				var self = this;
				common.loading(1);

				// 上传现场图片
				jQuery(".pic").off().click(function () {
					self.index = this;
					jQuery("#upLoadPickfiles").click();
				});

				if (self.businessType == 1) {
					$("#isDan_" + self.getNewId).show();
					$("#assetsNameView_" + self.getNewId).show();
					$("#finishNumView_" + self.getNewId).hide();
				} else {
					$("#isDan_" + self.getNewId).hide();
					$("#assetsNameView_" + self.getNewId).hide();
					$("#finishNumView_" + self.getNewId).show();
				}
				Dao.getTaskWorkInfo({
					userName: userInfor.accountName,
					deviceId: appKeyObj.deviceId,
					taskId: self.taskId, //任务id
					businessId: self.businessId, //维保业务id
					businessType: self.businessType, //1单点2区域
				}, function (data) {
					common.loading(0);
					if (data != null && data.length != 0) {
						self.fbsId = data.fbsId;
						self.orgId = data.orgId;
						self.workContentList = data.maintainStandardContentList;
						$("#waitWorkNum_" + self.getNewId).empty().html(common.transNullundefinedToline(data.assetsCount - data.finishCount));
						$("#workArea_" + self.getNewId).empty().html(common.transNullundefinedToline(data.fbsName));
						$("#systemName_" + self.getNewId).empty().html(common.transNullundefinedToline(data.fireSystemName));
						$("#assetsType_" + self.getNewId).empty().html(common.transNullundefinedToline(data.assetsCategoryName));
						if (self.businessType == 1) {
							$("#assetsName_" + self.getNewId).empty().html(common.transNullundefinedToline(data.assetsName));
						} else {
							$("#finishNum_" + self.getNewId).empty().html(common.transNullundefinedToline(data.finishCount + ""));
						}
						$("#workStandard_" + self.getNewId).empty().html(common.transNullundefinedToline(data.workStandard));

						for (var i = 0; i < data.maintainStandardContentList.length; i++) {
							var bean = data.maintainStandardContentList[i];
							var inputHtml = "";
							var checkHtml = `
								<p class="buttons-row" style="margin-top: 16px">
									<div class="checkItem">
									 	<input type="radio" name="checkRadio_` + i + `" value="0" checked="checked">
									 	<label name="normal" class="option-` + bean.id + ` checked" for="normal">正常</label>
								 	</div>
								 	<div class="checkItem" style="margin: 0 3%;">
									 	<input type="radio" name="checkRadio_` + i + `" value="1" >
									 	<label name="abnormal" class="option-` + bean.id + `" for="abnormal">异常</label>
								 	</div>
								 	<div class="checkItem">
									 	<input type="radio" name="checkRadio_` + i + `" value="2">
									 	<label name="notInvoled" class="option-` + bean.id + `" for="notInvoled">未涉及</label>
								 	</div>
								</p>`;
							var decHtml = `
								<p style="margin-top: 16px">
									<input type="text" class="des-` + bean.id + ` inDes" placeholder="在这里填写清晰明了的描述" />
								</p>`;
							var numHtml = `
								<p style="margin-top: 16px">
								<input type="number" class="num-` + bean.id + ` inNum"  placeholder="请输入数值" />
							</p>`
							switch (bean.type) { //1：单选，2：文本，3：数值，4：单选+文本，5：单选+数值，6：数值+文本
								case 1:
									inputHtml = checkHtml;
									break;
								case 2:
									inputHtml = decHtml;
									break;
								case 3:
									inputHtml = numHtml;
									break;
								case 4:
									inputHtml = checkHtml + decHtml;
									break;
								case 5:
									inputHtml = checkHtml + numHtml;
									break;
								case 6:
									inputHtml = numHtml + decHtml;
									break;
							}
							$("#workContentList_" + self.getNewId).append(`
								<div>
									<p class="workContent">` + bean.workContent + `</p>
									` + inputHtml + `
								</div>
							`);
							$("#workContentList_" + self.getNewId +" .option-" + bean.id).click(function () {
								let conClass = this.classList[0];
								let radioId = $(this).attr('name');
								$("#workContentList_" + self.getNewId +" ." + conClass).removeClass('checked');
								$(this).addClass('checked');
							});
						}
					}
				});
			},
			//提交数据
			upInfoData: function () {
				var self = this;
				//获取图片
				//作业前
				let beforPic = $("#picBeforeUrl_" + self.getNewId + " .pic-item");
				let beforImg = [];
				jQuery.each(beforPic, function (index, el) {
					let src = jQuery(el).attr("data-pic");
					beforImg.push(src);
				});
				// if (beforImg.length == 0) {
				// 	app.methods.showToastCenter("作业前的图片至少提交一张");
				// 	return;
				// }
				//作业后
				let afterPic = $("#picAfterUrl_" + self.getNewId + " .pic-item");
				let afterImg = [];
				jQuery.each(afterPic, function (index, el) {
					let src = jQuery(el).attr("data-pic");
					afterImg.push(src);
				});
				// if (afterImg.length == 0) {
				// 	app.methods.showToastCenter("作业后的图片至少提交一张");
				// 	return;
				// }
				let flag = false
				common.loading(1);
				var jsonStr = {};
				for (var i = 0; i < self.workContentList.length; i++) {
					var bean = self.workContentList[i];
					var valStr = {};
					switch (bean.type) {
						case 1:
							v1 = $("#workContentList_" + self.getNewId +" .option-" + bean.id + ".checked").prev().val();
							valStr["tab"] = v1;
							break;
						case 2:
							v1 = $("#workContentList_" + self.getNewId +" .des-" + bean.id).val();
							valStr["des"] = v1;
							break;
						case 3:
							v1 = $("#workContentList_" + self.getNewId +" .num-" + i).val();
							valStr["num"] = v1;
							break;
						case 4:
							v1 = $("#workContentList_" + self.getNewId +" .option-" + bean.id + ".checked").prev().val();
							v2 = $("#workContentList_" + self.getNewId +" .des-" + bean.id).val();
							valStr["tab"] = v1;
							valStr["des"] = v2;
							break;
						case 5:
							v1 = $("#workContentList_" + self.getNewId +" .option-" + bean.id + ".checked").prev().val();
							v2 = $("#workContentList_" + self.getNewId +" .num-" + i).val();
							valStr["tab"] = v1;
							valStr["num"] = v2;
							break;
						case 6:
							v1 = $("#workContentList_" + self.getNewId +" .des-" + bean.id).val();
							v2 = $("#workContentList_" + self.getNewId +" .num-" + i).val();
							valStr["des"] = v1;
							valStr["num"] = v2;
							break;
					}
					if(valStr.tab == 1){//正常未涉及不需要校验文本框，只有异常需要校验文本框必填
						if(valStr.des == ''){
							flag = true
						}
					}
					jsonStr[bean.id] = valStr;
				}

				//作业填报
				let isNotFill = false;
				let work = $("#workContentList_" + self.getNewId + " input");
				for (let j = 0; j < work.length; j++) {
					if (work[j].value == "" && flag) {
						isNotFill = true;
						break;
					}
				}
				if (isNotFill) {
					app.methods.showToastCenter("请填写作业填报内容");
					common.loading(0);
					return;
				}
				let paramData = {
					userName: userInfor.accountName,
					deviceId: appKeyObj.deviceId,
					taskId: self.taskId, //任务id
					businessId: self.businessId, //维保业务id
					businessType: self.businessType, //1单点2区域
					picBeforeUrls: beforImg.toString(),
					picAfterUrls: afterImg.toString(),
					maintainAccount: userInfor.accountName,
					description: JSON.stringify(jsonStr),
				};
				let IS_OFFLINE_MODULE = native.getDataByKey("IS_OFFLINE_MODULE");
				if (IS_OFFLINE_MODULE == "1"){
					native.updateMaintanceLocalData(paramData,self.fbsId,self.orgId,2);
				}
				Dao.postTaskWorkInfo(paramData, function (data,info) {
					app.router.back();
					app.view.current.el.f7View.router.currentPageEl.f7Component.htmlPage(true);//刷新楼栋页面
					common.loading(0);
					app.methods.showToastCenter(data.info);
				});
			},
		},
		on: {
			pageInit: function (e, page) {
				var self = this;
				var $ = self.$;
				self.getInfoData();
				//初始化上传
				upLoadImagesCompt(jQuery("#picBeforeUrl_" + self.getNewId), function (pic, isAdd) {}, true, null,'picBeforeUrl_container_' + self.getNewId, 'picBeforeUrl_pick_' + self.getNewId, "上传图片",true);
				upLoadImagesCompt(jQuery("#picAfterUrl_" + self.getNewId), function (pic, isAdd) {}, true, null,'picAfterUrl_container_' + self.getNewId, 'picAfterUrl_pick_' + self.getNewId, "上传图片",true);
			},
			pageAfterIn: function (e, page) {
				var self = this;
				var $ = self.$;
			},
		}
	}
</script>
